<template>
  <view class="ter-set">
    <view class="my-top">
      <view class="content">
        <u-cell-group>
          <u-cell
            @click="dealFun(6)"
            title="添加新的终端"
            :isLink="true"
            arrow-direction="right"
          >
          </u-cell>
        </u-cell-group>
      </view>
      <view class="content" v-for="(i, index) in dataArr" :key="index">
        <u-cell-group>
          <u-cell>
            <view slot="title" class="u-slot-title1">
              <view class="u-cell1">终端{{ index + 1 }}</view>
            </view>
          </u-cell>
          <u-cell>
            <view slot="title" class="u-slot-title1">
              <view class="u-cell1">终端编号</view>
            </view>
            <view slot="value" class="tips1">{{ i.terminalId || "-" }}</view>
          </u-cell>
          <u-cell @click="dealFun(1)" :isLink="true" arrow-direction="right">
            <view slot="title" class="u-slot-title1">
              <view class="u-cell1">高级喇叭</view>
            </view>
          </u-cell>
          <u-cell @click="dealFun(2)">
            <view slot="title" class="u-slot-title1">
              <view class="u-cell1">台卡</view>
            </view>
            <view slot="value" class="tips1">扫描绑定</view>
          </u-cell>
          <u-cell @click="dealFun(3)" :isLink="true" arrow-direction="right">
            <view slot="title" class="u-slot-title1">
              <view class="u-cell1">附加台卡</view>
            </view>
          </u-cell>
          <u-cell @click="dealFun(4)" :isLink="true" arrow-direction="right">
            <view slot="title" class="u-slot-title1">
              <view class="u-cell1">支付盒子</view>
            </view>
          </u-cell>
          <u-cell @click="dealFun(5)">
            <view slot="title" class="u-slot-title1">
              <view class="u-cell1">收银机</view>
            </view>
            <view slot="value" class="tips1">{{
              i.barcodeMachine || "未绑定"
            }}</view>
          </u-cell>
        </u-cell-group>
      </view>
    </view>
    <u-modal
      class="my-modal"
      :show="show"
      showCancelButton
      :title="content"
      @confirm="dealFun(7)"
      @cancel="dealFun(8)"
    ></u-modal>
  </view>
</template>

<script>
const app = getApp();
const globalData = app.globalData;
const apiUrl = globalData.wxApi;
const wxImg = globalData.wxImg;
import {
  getStoreData,
  dealNum,
  httpGet,
  bdMapToTxMap,
  txMapToBdMap,
} from "@/utils/http.js";
export default {
  data() {
    return {
      content: "确定要新添加终端吗？",
      show: false,
      dataArr: [],
      subStoreId: "",
    };
  },
  components: {},
  onShow() {},
  onLoad(options) {
    if (options && options.id) {
      this.getData();
    }
  },
  methods: {
    dealFun(index) {
      const _this = this;
      if (index == 6) {
        this.show = true;
      } else if (index == 7) {
        httpGet("/api/sellerstoreotherapply/createTerminal/" + this.subStoreId)
          .then((res) => {
            if (res.code == 0) {
              _this.getData(_this.subStoreId);
              _this.show = false;
            }
          })
          .catch((e) => {});
      } else if (index == 8) {
        this.show = false;
      }
    },
    getData(id) {
      const _this = this;
      if (id) {
        this.subStoreId = id;
        httpGet("/api/sellerstoreotherapply/terminalListBySubStoreId/" + id)
          .then((res) => {
            if (res.code == 0) {
              _this.dataArr = res.data || [];
            }
          })
          .catch((e) => {});
      } else {
        httpGet("/api/sellerstoreotherapply/terminalList")
          .then((res) => {
            if (res.code == 0) {
              if (res.data && res.data[0] && res.data[0].subStoreId) {
                _this.getData(res.data[0].subStoreId);
              } else {
                _this.dataArr = res.data || [];
              }
            }
          })
          .catch((e) => {});
      }
    },
  },
};
</script>

<style lang="scss">
.ter-set {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  background: #f8f8f8;
  width: 100vw;
  min-height: 100vh;
  padding: 16px;
  .my-top {
    display: flex;
    flex-direction: column;
    width: 100%;
    .ava {
      width: 40px;
      height: 40px;
      border-radius: 40px;
      overflow: hidden;
    }
  }
  .content {
    background: #fff;
    border-radius: 4px;
    padding: 0 16px;
    box-sizing: border-box;
    margin-bottom: 16px;
    flex-direction: column;
    width: calc(100vw - 32px);
    .tips1 {
      min-width: 210px;
      display: flex;
      justify-content: flex-end;
    }
    /deep/.u-border {
      border: none;
    }
    .no-store-h1 {
      margin: 24px 0;
      font-size: 16px;
      color: #333;
      text-align: center;
      width: 100%;
    }
    .no-store-h2 {
      margin: 24px 0;
      font-size: 14px;
      color: #666;
      text-align: center;
      width: 100%;
    }

    /deep/.u-cell__body {
      padding: 16px 0 !important;
    }
    /deep/.u-cell-group__wrapper {
      .u-line:first-child,
      .u-cell:last-child .u-line {
        display: none !important;
      }
    }
  }
}
</style>
